<template>
	<view class="newspage">
		<view class="btns">
			<view class="btn" @click="changeCur(index)" :class="{active:curbtn==index}" v-for="(item,index) in btn" :key="index">{{item}}</view>
		</view>
		<view class="news-list" v-if="curbtn==0">			
			<view class="new" v-for="(item,index) in gonggao" :key="index">
				<text>{{item.remark}}</text><text>{{item.time}}</text>
			</view>
		</view>
		<view class="news-list" v-else>
			<view class="new" v-for="(item,index) in gonggao" :key="index">
				<text>{{item.msg}}</text><text>{{item.date}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import fetch from '@/common/fetch.js'
	export default{
			data(){
				return{
					show:true,
					curbtn:0,
					gonggao:[],
					btn:['System Announce','Message']
				}			
			},
			mounted () {
			  fetch.request('/index/index/doLogin', {
			    'nick_name': '',
			    'login_pwd': ''
			  }, 'POST').then(res => {
			    this.getIndexInfo()
			  })
			},
			methods:{
				/**
				 * 获取首页信息的系统公告
				*/
				getIndexInfo () {
				  fetch.request('/index/Mobile/index', '', 'GET').then(res => {
				    let { data } = res
				    this.gonggao = data.zj_list				    
				  })
				},
				getSysMessage(){
					fetch.request('/index/sys/message', '', 'GET').then(res => {
					  let { data } = res
					  this.gonggao = data				    
					})
				},
				changeCur(index){
					this.curbtn = index
					if(index == 1){
						//请求站内消息
						this.getSysMessage()
					}else{
						//请求系统消息
						this.getIndexInfo()
					}
				}
			}
		}
	</script>
</script>

<style lang="less" scoped>
	.newspage{
		width: 100%;
		min-height: 100%;
	}
	.btns{
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 32rpx;
		box-sizing: border-box;
		.btn{
			flex: 1;
			text-align: center;
			height: 60rpx;
			line-height: 60rpx;
			font-size: 14px;
			&.active{
				color: #fff;
				background: #F53D46;
				border-radius: 60rpx;
			}
		}
	}
	.news-list{
		padding: 0 32rpx;
		box-sizing: border-box;
		.new{
			padding: 20rpx 0;
			box-sizing: border-box;
			border-bottom: solid 1rpx #f3f3f3;
			display: flex;
			flex-direction: column;
			font-size: 16px;
			text:last-child{
				margin-top: 20rpx;
				font-size:12px;
				color: #aaa;
			}
		}
	}
</style>
